﻿/*초기화*/
label {margin-bottom: 5px; cursor: pointer;}
#tab_item ul {list-style: none; border: 1px solid black;}
#tab_item li {margin: 10px 5px;}
.search {display: none; }

/*detail*/
#search_tab {
    margin-top: 10px;
    padding: 15px; border-radius: 10px; border: 1px solid black;
    background-color: white;
}
#search_tab #first {display: none;}
#search_tab #first ~ div:nth-of-type(1){display: none;}
#search_tab #first:checked ~ div:nth-of-type(1) {display: block;}

#search_tab #second {display: none;}
#search_tab #second ~ div:nth-of-type(2){display: none;}
#search_tab #second:checked ~ div:nth-of-type(2) {display: block;}

#search_tab section.buttons {overflow:hidden;}
#search_tab section.buttons > label {
    display: block; float: left;
    width: 100px; height: 30px;
    line-height:30px;
    text-align:center;
    box-sizing:border-box;
    border-radius: 25px 25px 0 0;
    border: 1px solid black;
    background:orchid;
    color:black;
}
#search_tab input:nth-of-type(1):checked ~ section.buttons > label:nth-of-type(1) {
    background:white;
    color:black;
}
#search_tab input:nth-of-type(2):checked ~ section.buttons > label:nth-of-type(2) {
    background:white;
    color:black;
}

input[type=search] {
    border-radius: 5px;
    box-sizing: border-box;
    padding-left: 20px;
    outline-color: skyblue;
    width: 400px;
    height: 30px;
}

ul input:focus {
    outline:none;
    border: 2px solid mediumpurple;
}

